@use "var.scss" as vars;

:root {
    --background-color: #f9f9f9;
    // element
    --el-color-primary: #216ef2;
    --el-color-danger: #ff2424;
    --el-color-success: #19b882;
    --el-color-primary-light-5: #216ef2;
    --el-text-color-primary: #000a1a;
}

#app {
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    overflow: hidden;
    background-color: var(--background-color);
}

/* 浮动 */
.fl {
    float: left
}

.fr {
    float: right
}

/* 清除浮动 */
.clearfix:after {
    content: " ";
    display: block;
    clear: both;
    visibility: hidden;
}

/* 弹性盒子 */
.flex {
    display: flex;
    display: -moz-flex;
}

.flex-wrap {  
    display: flex;
    display: -moz-flex;
    flex-wrap:wrap; 
}

.flex-column {
    display: flex;
    flex-direction: column;
}

.justify-center {
    justify-content: center;
}

.justify-between {
    justify-content: space-between;
}

.justify-end {
    justify-content: flex-end;
}

.align-middle,.items-center {
    align-items: center;
}

/* color */
.primary {
    color:  vars.$color-primary;
}

.danger {
    color:  vars.$color-danger;
}

.warning {
    color:  vars.$color-warning;
}

.success {
    color:  vars.$color-success;
}

.default {
    color: vars.$color-default;
}

.edit {
    color: vars.$color-primary;
    cursor: pointer;
    margin-right: 10px;
}
.delete {
    color: vars.$color-danger;
    cursor: pointer;
     margin-right: 10px;
}

/* 设置滚动条的样式 */
::-webkit-scrollbar {
    width: 5px;
    height: 10px;
}

/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    height: 25px;
    background: #d5d7db;
}
